import React from 'react';
import { NavigationContainer } from '@react-navigation/native';
import { createNativeStackNavigator } from '@react-navigation/native-stack';
import  ScanScreen  from './scan';
import { ConnectedScreen } from './connected';
import {ServiceScreen} from './service'
import {CharacteristicScreen} from './characteristic'
import {ActionScreen} from './action'
const { Navigator, Screen } = createNativeStackNavigator();

/*
 规划几个页面：
 1、扫描设备
 2、已绑定设备列表
 3、访问设备服务
 4、访问设备特征
 5、读写设备特征
*/
const HomeNavigator = () => (
  // <Navigator screenOptions={{headerShown: false}}>
  <Navigator screenOptions={{headerShown: false}}>
        <Screen name='Scan' component={ScanScreen} options={
      {
        title: '搜索设备'
      }
    } />
    <Screen name='Connected' component={ConnectedScreen} options={
      {
        headerShown:false,
        title:'已连接设备xxx'
      }
    } />
    <Screen name='Service' component={ServiceScreen} options={
      {
        headerShown:false,
        title:'设备服务xxx'
      }
    } />
    <Screen name='Characteristic' component={CharacteristicScreen} options={
      {
        headerShown:false,
        title:'设备特征'
      }
    } />
    <Screen name='Action' component={ActionScreen} options={
      {
        headerShown:false,
        title:'操控设备'
      }
    } />
  </Navigator>
  /*<Stack.Navigator>
      <Stack.Screen name="Scan" component={ScanScreen} options={{
        headerRight: () => (
          <Button
            onPress={() => alert('This is a button!')}
            title="已链接的设备"
            color="#1890ff"
          />
        ),
      }} />
      <Stack.Screen name="Control" component={ControlScreen} />
    </Stack.Navigator>
    */
);

export const AppNavigator = () => (
  <NavigationContainer>
    <HomeNavigator />
  </NavigationContainer>
);